<template>
  <div class="topNav">
    <!-- 顶部control -->
    <TopControl :data="data.data1"></TopControl>

    <div class="tabs">
      <Tabs></Tabs>
    </div>
  </div>
</template>
<script lang="ts" setup>
import { reactive, onMounted } from "vue";
import TopControl from "@/components/topControl.vue";
import Tabs from "@/components/Tabs.vue";
let data: any = reactive({
  data1: [],
});
onMounted(() => {
  setTimeout(() => {
    data.data1 = [{a:1},{a:2}];
  }, 4000);
});
</script>
<style lang="scss" scoped>
.topNav {
  height: 100px;
  position: sticky;
  top: 0px;
  z-index: 999;
  background-color: black;
  display: flex;
  flex-direction: column;
}
.tabs {
  flex: 1;
  background-color: #f5f2f2;
}
</style>
